<extend name="common/base" />
<block name="resource">
    <link href="__ASSET__/Home/v4/src/css/explore.css" rel="stylesheet">
    <link href="__ASSET__/Home/v4/src/css/index.css" rel="stylesheet">
    <link href="__ASSET__/Home/v4/src/css/home.css" rel="stylesheet">
    <link href="__ASSET__/Home/v4/src/css/videoCommon.css" rel="stylesheet">
    <!--[if lt IE 9]>
    <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
    <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <style> 
        .video-box {
              height:auto;
        }
         .explore-videolist-new .list-hover_video .item-play{ 
                 position:relative;
                 overflow:hidden;
          }

          .explore-videolist-new .list-hover_video .item-play img{
              display:block;
          }
          .explore-videolist-new .list-hover_video .item-play .video_play{
               position:absolute;
               width:100%;
               height:100%;
               left:0;
               top:0;
               z-index:100;
          }
         .item-play{
              height:150px;
              overflow:hidden;
         }
         #share{
            padding-top: 0;
          }
          .share_box{
                position: absolute;
                padding: 10px 0;
                width: 210px;
                height: 52px;
                background: #f2f2f2;
                right: 50%;
                margin-right: -105px;
                top: -60px;
                box-shadow: 2px 2px 5px #666;
                z-index: 998;
                display:none;
          }
          .share_box:before {
                border: none;
          }
          .bdsharebuttonbox{
            top: 0;
          }
          .bdsharebuttonbox:before {
                width: 0;
                height: 0;
                content: "";
                border-top: solid 8px #f2f2f2;
                border-left: solid 8px transparent;
                border-right: solid 8px transparent;
                position: absolute;
                left: 50%;
                bottom: -7px;
                margin-left: -4px;
          }
          .game-num .game_gz_item{
              float:left;
              width:64px;
              display:inline-block;
              
          }
          .game-num>span.game_gz_item>button{
              display:block;
              text-align:center;
              width:64px;
              height: 24px;
              line-height: 26px;
              padding-right:0;
              background:#f1c259;
              color:#483a1b;
              border-radius:3px;
              -webkit-border-radius:3px;
          }
          .game-num .game_gz_item button:hover{
              background:#d4a439;
          }
          .level {
            width: 60px;
            height: 25px;
            line-height:25px;
     }
         .list-hover_video{
              height:220px\0;
         }
         .this-game-player-head .newG-icon{
             bottom: -5px;
             height: 30px;
             position: absolute;
             right: -5px;
             width: 30px;
             transition: none;
         }
    </style>
</block>
<block name="content">
    <div class="gamearea-bg match-desc-video paddingt245 relative">
        <em class="gamearea-default-font white font_micro font13 absolute">{$game.name}</em>
        <div class="container paddingtb20">
            <!--热门比赛-->
            <div class="match-main-left white-bg left relative">
                <p class="absolute yellow game-num" style="top:-40px;">
                    <span data-game-flag='true' class="game_gz_item">
                        <if condition="$game['is_scribe']">
                            <button class="red game_gz_click">已关注</button>
                           <else />
                            <button class="red game_gz_click">马上关注</button>
                        </if>
                    </span>
                    <span style="float:left;width:400px;margin-left:15px;">专区活跃排名<em>{$game.rank}</em></span> 
                </p>
                <div class="game-area-special main-right-box min-height1050" style="padding:0;">
                   <h1 class="game-area-h1 font13 colorthree" style="text-indent:10px;">{$game.name}专区</h1>
                   <!--本专区活跃玩家-->
                   <div class="this-game-player">
                       <h1 class="font13">本专区活跃玩家</h1>
                       <ul class="this-game-player-ul gray01-bg">
                            <volist name="users" id="_user">
                            <assign name="user" value="$_user.user" />
                                <li>
                                    <p class="this-game-player-head relative">
                                        <notempty name="user.id">
                                        <a href="{:C('LOCAL_DOMAIN')}/user-{$user.id}" title="{$user.nickname}的主页">
                                        <else />
                                        <a href="javascript:;" title="该用户已经被删除">
                                        </notempty>
                                            <img src="{$user.avatar|default='__ASSET__/Home/v4/src/images/avatar-mr.png'}" alt="{$user.nickname}" class="transition">
                                            <notempty name="user.auth">
                                              <img class="newG-icon" title="{$user.auth.name}" src="{$user.auth.pic}">
                                            </notempty>
                                        </a>
                                    </p>
                                    <span class="this-game-player-name">
                                        <notempty name="user.id">
                                        <a href="{:C('LOCAL_DOMAIN')}/user-{$user.id}" title="{$user.nickname}的主页" class="colorthree textoverflow">
                                        <else />
                                        <a href="javascript:;" title="该用户已经被删除" class="colorthree textoverflow">
                                        </notempty>
                                            {$user.nickname}
                                        </a>
                                    </span>
                                </li>
                            </volist>
                       </ul>
                   </div>
                   <!--本专区视频列表-->
                   <div class="this-game-list" style="padding:0 2px 0 2px;">
                        <h1 class="font12 colorthree">
                            <p class="h1-left left" data-hot-upload="true">
                               <span class="pre hot_upload_btn active" title="最新上传">
                                    <b>最新上传</b>
                                </span>
                                <span class="pre hot_upload_btn" title="最热视频"  data-type="hot">
                                    <b>最热视频</b>
                                </span> 
                            </p>
                        </h1>
                        <notempty name="videos">
                        <ul class="right-box row explore-videolist explore-videolist-new paddingtb20 explore-videolist-contain" style="padding: 10px 5px;">
                            <volist name="videos" id="video" key="v_index">
                                <li class="list-item list-hover_video col-lg-4 col-md-4 col-xs-4" style="position:relative;" data-index="{$v_index - 1}">
                                    <div class="item-play dark-bg" data-video="{$video.pre_uri}">
                                        <img class="lazy" src="__ASSET__/Home/v4/src/images/explore-default.jpg" data-original="{$video.thumb}" alt="{$video.title}" />
                                    </div>
                                    <p class="item-title font13 colorthree">
                                         <a href="{:C('LOCAL_DOMAIN')}/video-{$video.id}">{$video.title}</a>
                                    </p>
                                    <div class="item-infos font12">
                                        <span class="author left">
                                            <i class="author-images"></i>
                                            <label class="author-name">
                                                <a  href="{:C('LOCAL_DOMAIN')}/user-{$video.user.id}">{$video.user.nickname}</a>
                                            </label>
                                        </span>
                                        <span class="times right">
                                            <i class="times-images"></i>
                                            <em class="times-num" title="播放{$video.statis.play}次">{$video.statis.play}</em>
                                        </span>
                                    </div>
                                </li>
                            </volist>
                        </ul>
                        <!--加载等待-->
                        <div class="load-more load-more-video" style="display:block;">
                            <i><img src="__ASSET__/Home/v4/src/images/loading-white.gif" alt="正在加载，请稍候..."/></i>
                            <span>正在加载，请稍候...</span>
                        </div>
                        <div class="page" data-page="true">
                             <ul></ul>
                        </div>
                        <else />
                            <!--类null-state为空状态-->
                            <div class="list-item-null font14 colorsix">
                                <div class="null-img"></div>
                                <div class="null-info">很遗憾，没有找到相关，试试其他的吧...</div>
                            </div>
                        </notempty>
                   </div>
                </div>
            </div>   
            <!--右边-->   
            <div class="match-main-right explore-game-right right">
                <notempty name="races">
                <!--最新比赛-->
                <div class="latest-match main-right320 marginb20 white-bg">
                    <h1 class="font12 colorthree">
                        <span class="left">最新比赛</span>
                        <a class="colorthree right" href="{:C('LOCAL_DOMAIN')}/match-game-{$game.id}" title="查看更多比赛">查看更多</a>
                    </h1>
                    <notempty name="races">
                        <ul class="other-event-rec">
                            <volist name="races" id="race">
                            <li>
                                <div class="right-item-head">
                                    <a href="{:C('LOCAL_DOMAIN')}/match-group-{$race.id}">
                                        <p class="game-logo">
                                            <img src="{$race.cover|default=$race['match']['pc_cover']}" data-original="{$race.cover|default=$race['match']['pc_cover']}"  alt="{$race.title}" class="transition lazy"/>
                                        </p>
                                        <p class="game-info">
                                            <span class="game-title">{$race.title}</span>
                                            <span class="game-time game-time1">{$race.race_hour}</span>
                                        </p>
                                    </a>
                                </div>
                                <div class="right-item-content display-box">
                                    <div class="right-team1">
                                        <p class="right-team1-logo">
                                            <img src="{$race['team'][0]['logo']}" alt="{$race['team'][0]['name']}"/>
                                        </p>
                                        <p class="team-name1">{$race['team'][0]['name']}</p>
                                    </div>
                                    <div class="game-score box-flexo">
                                        <div class="score-num font24">
                                            <b class="num1">{$race['score'][0]}</b>
                                            <b class="num">:</b>
                                            <b class="num2">{$race['score'][1]}</b>
                                        </div>
                                        <div class="schedule">
                                            <volist name="race.races" id="race_id" key="index">
                                                <a href="{:C('LOCAL_DOMAIN')}/match-detail-{$race_id}">{$index}</a>
                                            </volist>
                                        </div>
                                    </div>
                                    <div class="right-team1">
                                        <p class="right-team1-logo">
                                            <img src="{$race['team'][1]['logo']}" alt="{$race['team'][1]['name']}"/>
                                        </p>
                                        <p class="team-name1">{$race['team'][1]['name']}</p>
                                    </div>
                                </div>
                            </li>
                            </volist>
                        </ul>
                    <else />
                        <!--类null-state为空状态-->
                        <div class="content-right-item-null font14 colorsix">
                            <div class="null-img1"></div>
                            <div class="null-info">很遗憾，没有找到相关信息</div>
                        </div>
                    </notempty>
                </div>
                </notempty>
                <!--相关新闻-->
                <div class="latest-match main-right320 white-bg">       
                    <h1 class="font12 colorthree">
                        <span class="left">相关新闻</span>
                        <a href="{:C('LOCAL_DOMAIN')}/news" title="查看更多新闻" class="colorthree right">更多</a>
                    </h1>
                    <notempty name="newslist">
                        <ul class="news-event news-event-list">
                            <volist name="newslist" id="news">
                                <li>
                                    <p class="news-event-tilte font12">
                                         <a href="{:C('LOCAL_DOMAIN')}/news-{$news.id}" title="查看新闻详情" class="colorthree">
                                             {$news.title}
                                         </a>
                                    </p>
                                    <notempty name="news.cover">
                                        <p class="news-event-img">
                                            <a href="{:C('LOCAL_DOMAIN')}/news-{$news.id}" title="查看新闻详情">
                                                <img src="{$news.cover}" alt="{$news.title}"/> 
                                            </a>
                                        </p>
                                    <else/>
                                        
                                    </notempty>
                                                
                                    <notempty name="news.detail">
                                        <p class="news-event-con font12 colorsix">
                                            <a href="{:C('LOCAL_DOMAIN')}/news-{$news.id}" title="查看新闻详情">{$news.detail}</a>
                                        </p>
                                    </notempty>
                                </li>
                            </volist>
                        </ul>
                    <else />
                        <!--类null-state为空状态-->
                        <div class="content-right-item-null font14 colorsix">
                            <div class="null-img3"></div>
                            <div class="null-info">很遗憾，没有找到相关信息</div>
                        </div>
                    </notempty>
                </div>
            </div>
        </div>
    </div>
    <include file="Explore/player_template"/>
</block>

<block name="component">
    <a href="#0" class="cd-top">Top</a>
    <script src="__ASSET__/Home/v4/lib/js/jwplayer.js"></script>
    <script src="__ASSET__/Home/v4/lib/js/jquery.zclip.min.js"></script>
    <script src="__ASSET__/Home/v4/lib/js/date_format.js"></script>
    <script src="__ASSET__/Home/v4/lib/js/face.js?v=1.0"></script>
    <script src="__ASSET__/Home/v4/lib/js/jquery.mCustomScrollbar.concat.min.js"></script>
    <script src="__ASSET__/Home/v4/dist/js/game_list.js?v=1.0.1"></script>
    <script src="__ASSET__/Home/v4/dist/js/HDvideo.js?v=1.0.1"></script>
    <script src="__ASSET__/Home/v4/src/js/video_window.js?v=1.0.4"></script>
    <script>
        window._THIS = {
            data:{$videos|json_encode},
            bg_img:"{$game.pc_background}",
            game:window.location.href,
            p:1,
            pager:{$pager|default=12},
            pager_block:3,
            total:{$total|default=0},
            doScribeUrl:"{:U('/Home/Game/scribe', ['id' => $game['id']], '', C('MAIN_DOMAIN'))}",
            unScribeUrl:"{:U('/Home/Game/unscribe', ['id' => $game['id']], '', C('MAIN_DOMAIN'))}",
            // doScribeUrl:"/scribe",
            // unScribeUrl:"/unscribe",
            dolike : "{:U('/Home/like/dolike', [], '', C('MAIN_DOMAIN'))}",
            unlike : "{:U('/Home/like/unlike', [], '', C('MAIN_DOMAIN'))}",
            other:"{:C('LOCAL_DOMAIN')}/user-",
            dofollow : "{:U('/Home/follow/dofollow', [], '', C('MAIN_DOMAIN'))}",
            unfollow : "{:U('/Home/follow/unfollow', [], '', C('MAIN_DOMAIN'))}",
            add : "{:U('/Home/favour/add', [], '', C('MAIN_DOMAIN'))}",
            undo : "{:U('/Home/favour/undo', [], '', C('MAIN_DOMAIN'))}",
            getCommentList: "{:U('/Home/video/getCommentList', [], '', C('MAIN_DOMAIN'))}",
            addComment : "{:U('/Home/video/comments', [], '', C('MAIN_DOMAIN'))}",
            shareUrl : "{:C('LOCAL_DOMAIN')}/video-",
            VideoPlay:"{:C('LOCAL_DOMAIN')}/video-play-",
            page_type:'game',
            videoInfoUrl: "{:U('video/info', [], '', C('MAIN_DOMAIN'))}",
        };
    </script>
    <script src="__ASSET__/Home/v4/dist/js/background.js"></script>
</block>
